<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <link rel="stylesheet" href="../../css/geological/reset.css"/>
    <link rel="stylesheet" href="../../css/geological/css.css"/>
    <link rel="stylesheet" href="../../css/geological/public.css"/>
    <script type="text/javascript" src="../../js/geological/jquery.min.js"></script>
    <script type="text/javascript" src="../../js/geological/jquery.validate.min.js"></script>
    <script type="text/javascript" src="../../js/geological/messages_zh.min.js"></script>
    <!--[if lt IE 9]>
    <script src="../../js/geological/html5shiv.min.js"></script>
    <script src="../../js/geological/respond.min.js"></script>
    <![endif]-->
    <title>登录</title>
</head>
<body id="login">
<div class="header clearfix">
    <div class="logo"></div>
    <div class="title">深圳市部九窝余泥渣土受纳场安全监测预警信息系统</div>
    <!-- <div class="title">绵阳市远程监控与预警决策指挥系统</div> -->
</div>
<div class="log-main">
    <div class="log-box">
        <div class="log-title">后台登录中心</div>
        <form>
            <div class="form-box" style="height: 350px;">
                <div class="input-g g1">
                    <span class="icon-d icon-user"></span>
                    <input id="username" name="username" type="text" placeholder="用户名" onfocus="this.placeholder=''" onblur="this.placeholder='用户名'" value=""/>
                    <label for="username"></label>
                </div>
                <div class="input-g">
                    <span class="icon-d icon-lock"></span>
                    <input id="password" type="password" name="password" placeholder="密码" onfocus="this.placeholder=''" onblur="this.placeholder='密码'" value=""/>
                    <label for="password"></label>
                </div>
                <input class="submit" type="button" value="登录" onclick="login();"/>
            </div>
        </form>
    </div>
</div>
<div class="footer clearfix">
    <div class="foot-l left">
        Copyright © 2016-2017&nbsp;&nbsp;<a href="#">深圳市城市公共安全技术研究院</a>.&nbsp;&nbsp;All rights reserved.
    </div>
    <div class="foot-r right">
        Version 1.0.1
    </div>
</div>
<script type="text/javascript" src="../../js/geological/public.js"></script>
<script>
    $().ready(function() {
// 在键盘按下并释放及提交后验证提交表单
        $("#logForm").validate({
            rules: {
                uname: {
                    required: true,
                },
                password: {
                    required: true,
                }
            },
            messages: {
                uname: {
                    required: "请输入用户名",
                },
                password: {
                    required: "请输入密码",
                },
            },
            submitHandler:function( form ){
                form.submit();
            },
        });
    });
    
    function login(){
    	var paramMap = {};
		paramMap.login_name = $("#username").val()
		paramMap.login_password = $("#password").val()
    	$.ajax({
			  url: "../../login",
			  type : 'post',
			  async : false,
			  data: JSON.stringify( paramMap ),
			  contentType: "application/json; charset=utf-8",
			  dataType: "json",
			  success: function(json) {
				  if( json.result == "success" ){
					  window.location.href = "index.html";
				  }else{
					  alert(json.message)
				  }
			  }
		});
    }
</script>
</body>
</html>